Jen Simmons presents "Video on WordPress" at WordCamp NYC in October 2008. Learn various ways to put video on your wordpress website.

1. Video on WordPress
WordCamp New York
October 5, 2008
Jen Simmons
Milkweed Media Design

2. How to Put Video on Your
WordPress website
Embed code
Viper’s Video Quicktag
Show in a Box community
vPIP
Recent Videos, Related
Videos, Video Archives
Video themes

3. The Easiest Way
Upload your video to
(or find someone else’s
video at) a video
hosting site.
ie: YouTube, Blip.tv,
Vimeo, Viddler
Grab the embed code
Paste it in a WP post
(in the “html” window)

5. Why is this good?
It’s easy
It uses a video player
your audience knows
how to use already
Using technology that
is easy frees up more
of your time to create
videos and post them

6. Why is this
bad?
There’s nothing in the feed.
Nothing shows up in Miro.
People have to come to
your site to see your
videos. You aren’t
broadcasting.
You are tying yourself, your
site to a 3rd party brand.
It’s all flash. No iPhone
support beyond YouTube.

7. <detour>

8. Your Video
+
RSS feed
=
Broadcasting
Television as we’ve
known it is dying

9. Miro: “Tivo for internet video”

11. Also, iTunes
for watching on your computer,
or iPod or iPhone (if the videos are in the right format)

12. And…aggregation http://mefeedia.com

13. The Web
is more
than a
giant
brochure
rack.
photo by Stephanie Asher

14. Web 2.0 … 3.0…
It’s not (only) about the page

15. </detour>

16. Why is this
bad?
There’s nothing in the feed.
Nothing shows up in Miro.
People have to come to
your site to see your
videos. You aren’t
broadcasting.
You are tying yourself, your
site to a 3rd party brand.
It’s all flash. No iPhone
support beyond YouTube.

17. More bad
The html is
not valid
That embed code
might freak out
people who post
to the site.
Remembering to
use the html side
could be too
much geekery.

18. Viper’s Video Quicktags
http://
wordpress.org/
extend/plugins/
vipers-video-
quicktags/
Click on a cute
button, then
paste just the
URL into a box
with clear
directions.

19. Results using Viper’s Video Quicktags
Looks exactly the
same on the website
Valid HTML
At least the feed is not
empty
But still nothing in Miro,
nothing in iTunes, no
broadcasting
Still only Flash format

20. Lots of Similar Plugins
search at http://wordpress.org/extend/plugins
Smart YouTube
wordTube
Gecko Tube
Embedded Videos
Flash Video Player
EasyTube
XHTML Video Embed

21. Wish List
aggregate video to the internet via RSS feeds
support multiple video formats
support for mobile devices
create a great-looking website that’s easy to use
utilize technology that’s not overwhelming to contributors
encourage watching of older, archived content
promote community + discussion
encourage viewers to virally share videos

22. Show in a Box
http://showinabox.tv
Community of
People figuring out
how create video-
centric websites
using WordPress
Forums
Tutorials
Recommended WP
Plugins and Themes

27. vPIP: Videos Playing in Place
Enric Teller
http://wordpress.org/extend/plugins/vpip-videos-playing-in-place/
http://vpip.org

28. vPIP Screencast Tutorial
Ryanne Hodson
at showinabox.tv

29. vPIP Screencast Tutorial
Ryanne Hodson
at showinabox.tv

30. vPIP Screencast Tutorial
Ryanne Hodson
at showinabox.tv

32. How to post via vPIP

33. vPIP
supports multiple formats
creates a separate feed for each format
post by entering URLs to video files into a form box
video files can be hosted anywhere — on your server, at
blip.tv, elsewhere
create poster image and thumbnail manually, also
entering the URLs for those into the form box
specify any flash player, including your own custom player
offer embed code for sharing

34. Miro: Ryan in Hungry
all Quicktime movies, none of other formats

35. More
Plugins
Related Videos
Recent Videos
Video Archives

36. Related Videos
Gives you a chance
to mark each post
with other videos
that are related, and
have those show up
as thumbnails in the
sidebar (or wherever)

37. Recent Like any recent posts plugin,
Recent Videos makes a list of
Videos recent videos. In this case,
however, it’s a visual list, using a
thumbnail for each video.

38. Video
Archive
Creates a page (or
set of pages) that
list previous video
posts with a
thumbnail image
and links to the
videos. Better for
archiving than
tools designed for
text posts.

39. Site Design
Enough with the geeky plugin debate.
How does the website look?

43. Themes
What themes are
out there to help you
create a video site?
Show in a Box plugins
work with any WP theme
Double Feature Dark
Polished
by Adam Warner
with Cheryl Colan
Spacey
by Michael Verdi

44. Double
Feature
theme by
Adam Warner
with Cheryl Colan
http://showinabox.tv/
themes/
- displays two videos
side-by-side, from two
different categories

45. Spacey
theme by
Michael Verdi
http://showinabox.tv/
themes/
- built on K2
- designed to be
customized

47. Other Video-centric
WordPress Themes
(These have nothing to do with vPIP, Show in
a Box, or any of the plugins I’ve shown you.
I believe these themes use custom fields /
possibly custom plugins. Not open source.)

48. Video
Premium theme by
Quommunication
$75 (or up to $245)
http://quommunication.com

49. On
Demand
Premium theme by
Jason Schuller
Press75
$75 (or up to $250)
http://www.press75.com

50. TV
Elements
Premium theme by
Jason Schuller
Press75
$75 (or up to $250)
http://www.press75.com

51. Video
Elements
Premium theme by
Jason Schuller
Press75
$50 (or up to $175)
http://www.press75.com

52. Video
Flick
Premium theme by
Jason Schuller
Press75
$50 (or up to $175)
http://www.press75.com

53. Premium
Themes
Videos do not show up in
the feeds
Subscribing in Miro
results in nothing
Lo-fi Saint Louis is built
on On Demand, and Bill
Streeter got his feeds
working. http://lofistl.com

54. Foundation Themes
using Embed code Spacey
importance of feeds Double Feature
Miro, iTunes Premium Themes
Plugins Show in a Box
Viper’s Video Quicktag Forums
many others in the directory Tutorials
vPIP Recommendations
Related Videos, Recent Updates
Videos, Video Archive
http://showinabox.tv

55. Jen Simmons
Milkweed Media Design
http://milkweedmediadesign.com
WordPress / Drupal design + development